﻿<UserControl x:Class="CPPEI.Coolzon.Theme.Default.MainViewControl.JSControlView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <UserControl.Resources>
        <!--定义按钮样式-->
        <Style TargetType="Button">
            <Setter Property="Foreground" Value="Black"/>
            <!--修改模板属性-->
            <Setter Property="Template">
                <Setter.Value>
                    <!--控件模板-->
                    <ControlTemplate TargetType="Button">
                        <!--背景色-->
                        <Border x:Name="back" Opacity="0.8" CornerRadius="3">
                            <Border.BitmapEffect>
                                <OuterGlowBitmapEffect Opacity="0.7" GlowSize="0" GlowColor="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(Button.Background).(SolidColorBrush.Color)}"/>
                            </Border.BitmapEffect>
                            <Border.Background>
                                <ImageBrush ImageSource="/CPPEI.Coolzon.Theme.Default;component/Images/anz1.png" Stretch="Fill"/>
                                <!--<LinearGradientBrush StartPoint="0,0" EndPoint="0,1.5">
                                    <GradientBrush.GradientStops>
                                        <GradientStopCollection>
                                            <GradientStop Color="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(Button.Background).(SolidColorBrush.Color)}" Offset="0"/>
                                            <GradientStop Color="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(Button.Background).(SolidColorBrush.Color)}" Offset="0.4"/>
                                            <GradientStop Color="#FFF" Offset="1"/>
                                        </GradientStopCollection>
                                    </GradientBrush.GradientStops>
                                </LinearGradientBrush>-->
                            </Border.Background>
                            <!--前景色及边框-->
                            <Border x:Name="fore" BorderThickness="0" CornerRadius="3" BorderBrush="#5555">
                                
                                <!--按钮内容-->
                                <ContentPresenter x:Name="content" HorizontalAlignment="Center" VerticalAlignment="Center" Content="{TemplateBinding  Content}"  >
                                    <ContentPresenter.BitmapEffect>
                                        <DropShadowBitmapEffect Color="#000" Direction="-90" ShadowDepth="2" Softness="0.1" Opacity="0.3"/>
                                    </ContentPresenter.BitmapEffect>
                                </ContentPresenter>
                            </Border>
                        </Border>
                        <!--触发器-->
                        <ControlTemplate.Triggers>
                            <!--鼠标移入移出-->
                            <Trigger Property="IsMouseOver" Value="True">
                                <Trigger.EnterActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation To="6" Duration="0:0:0.2" Storyboard.TargetName="back" Storyboard.TargetProperty="(Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)"/>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.EnterActions>
                                <Trigger.ExitActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation Duration="0:0:0.2" Storyboard.TargetName="back" Storyboard.TargetProperty="(Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)"/>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.ExitActions>
                            </Trigger>
                            <!--按钮按下弹起-->
                            <Trigger Property="IsPressed" Value="True">
                                <Setter Property="Background" TargetName="back">
                                    <Setter.Value>
                                        <ImageBrush ImageSource="/CPPEI.Coolzon.Theme.Default;component/Images/anz2.png" Stretch="Fill"/>
                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                            <!--按钮失效-->
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter Property="Foreground" Value="#B444"/>
                                <Trigger.EnterActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation To="0" Duration="0:0:0.3" Storyboard.TargetName="back" Storyboard.TargetProperty="(Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)"/>
                                            <DoubleAnimation To="1" Duration="0:0:0.1" Storyboard.TargetName="content" Storyboard.TargetProperty="(ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Opacity)"/>
                                            <DoubleAnimation To="-135" Duration="0:0:0.1" Storyboard.TargetName="content" Storyboard.TargetProperty="(ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Direction)"/>
                                            <ColorAnimation To="#FFF" Duration="0:0:0.3" Storyboard.TargetName="content" Storyboard.TargetProperty="(ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Color)"/>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.EnterActions>
                                <Trigger.ExitActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation Duration="0:0:0.1" Storyboard.TargetName="back" Storyboard.TargetProperty="(Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)"/>
                                            <DoubleAnimation Duration="0:0:0.1" Storyboard.TargetName="content" Storyboard.TargetProperty="(ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Opacity)"/>
                                            <DoubleAnimation Duration="0:0:0.1" Storyboard.TargetName="content" Storyboard.TargetProperty="(ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Direction)"/>
                                            <ColorAnimation Duration="0:0:0.1" Storyboard.TargetName="content" Storyboard.TargetProperty="(ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Color)"/>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.ExitActions>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="btnDisplayflow" TargetType="{x:Type Button}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="true">
                            <ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>
    <Grid x:Name="gridJSView">
        <Grid.Background>
            <ImageBrush ImageSource="/CPPEI.Coolzon.Theme.Default;component/Images/bgiframe.jpg" Stretch="Fill"/>
        </Grid.Background>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="auto"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="auto"/>
        </Grid.ColumnDefinitions>
        <StackPanel Grid.Column="0" Margin="5">
            <Button x:Name="leftLoop" Style="{StaticResource btnDisplayflow}" BorderThickness="0" 
                    Grid.Row="0" Grid.Column="0" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,100,0,0"
                    PreviewMouseDown="leftLoop_PreviewMouseLeftButtonDown" PreviewMouseUp="leftLoop_PreviewMouseLeftButtonUp"
                    MouseEnter="leftLoop_MouseEnter"  MouseLeave="leftLoop_MouseLeave" Width="50" 
                    Height="50" Panel.ZIndex="2" Cursor="Hand" Opacity="0.2" TouchDown="leftLoop_TouchDown" TouchUp="leftLoop_TouchUp" TouchEnter="leftLoop_TouchEnter" TouchLeave="leftLoop_TouchLeave">
                <Button.Background>
                    <ImageBrush ImageSource="../Images/arrow_right_3.png"/>
                </Button.Background>
            </Button>
          
        </StackPanel>
        <Grid Grid.Column="1">
            <Grid.RowDefinitions>
                <RowDefinition  Height="auto"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            <StackPanel Grid.Row="0" Orientation="Horizontal" HorizontalAlignment="Right">
                <Button Name="_ctlBtnClose" Content="关闭" Margin="0,20,20,0" Height="40" Width="70" Click="_ctlBtnClose_Click"/>
            </StackPanel>
            <WrapPanel x:Name="spRecord" Grid.Row="1"  Margin="15" HorizontalAlignment="Left"  VerticalAlignment="Top">
            </WrapPanel>
        </Grid>
        
        <StackPanel Grid.Column="2" Margin="5">
            <Button x:Name="rightLoop" Style="{StaticResource btnDisplayflow}" BorderThickness="0" Opacity="0.2" 
                    Grid.Row="0" Grid.Column="0" HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0,100,0,0"
                    PreviewMouseDown="rightLoop_PreviewMouseLeftButtonDown" PreviewMouseUp="rightLoop_PreviewMouseLeftButtonUp"
                    MouseEnter="rightLoop_MouseEnter" MouseLeave="rightLoop_MouseLeave" Width="50" 
                    Height="50" Panel.ZIndex="2" Cursor="Hand" TouchDown="rightLoop_TouchDown" TouchUp="rightLoop_TouchUp" TouchEnter="rightLoop_TouchEnter" TouchLeave="rightLoop_TouchLeave">
                <Button.Background>
                    <ImageBrush ImageSource="../Images/arrow_left_3.png" />
                </Button.Background>
            </Button>
        </StackPanel>
    </Grid>
</UserControl>
